<template>
  <div style="padding:0 0.3rem;">
    <div class="flexbc" style="border-bottom: 1px #ddd solid; padding: 0.3rem 0; " v-for="item in list" :key="item.id">
    	<div class="flexc">
    		<div style="margin-right: 30rpx;">
    			<img :src="item.img" style="width: 1.5rem; margin-right: 0.3rem;"></img>
    		</div>
    		<div>
    			<div class="f14" style="margin-bottom: 0.1rem;">{{item.name}}</div>
    			<div class="flexc f12" style="margin-bottom: 0.1rem;">
    				<!-- <div style="color: forestgreen; margin-right: 0.1rem;">名额充足</div> -->
    				<div style="color: #666; ">分成：{{item.sharing_ratio}}%</div>
    			</div>
    			<div class="f12" style="color: #999; font-size: 0.24rem;">{{item.desc}}</div>
    		</div>
    	</div>
    	<div>
    		<van-button type="primary" size="small" @click="haibao(item)" text="分销"></van-button>
    	</div>
    </div>
    <html2canvass ref="html2canvass" :item="item" v-if="html2canvaslog"></html2canvass>
    <footers></footers>
  </div>
</template>

<script>
  import footers from './footer.vue'
  import html2canvass from "./html2canvas.vue";
  export default {
    components:{
      footers,html2canvass
    },
    name: 'index',
    data() {
      return {
        list:[],
        item:"",
        html2canvaslog:false
      }
    },
    created() {

      this.getlist()
    },
    methods: {
      haibao: function(item) {
        this.html2canvaslog = false;
        this.item = {
          inv_code:item.inv_code
        }
        this.$nextTick(() => {
          this.html2canvaslog = true;
        });
      },
      getlist: function() {
        axios.get(`${this.IP_URL}/api/game/list?page=1&page_size=100`).then(response=> {
        		if (response.data.msg.code == 0) {
        			this.list = response.data.data.data
        		} else {
              if(response.data.msg.code == 401){

                if(this.$route.query.code){
                  axios.post(`${this.IP_URL}/api/auth/login`,{code:this.$route.query.code,user_inv:this.$route.query.user_inv}).then(response=> {
                  		if (response.data.msg.code == 0) {
                  			localStorage.setItem('token', response.data.data.token)
                        localStorage.setItem('info', JSON.stringify(response.data.data.info))

                        this.getlist()
                  		} else {
                        var url = 'https://open.weixin.qq.com/connect/oauth2/authorize?';
                        url += 'appid=wxddcfde267c9679f5';
                        url += '&redirect_uri=' + encodeURIComponent('https://wx.jianzhiwz.top/h5/index?user_inv='+this.$route.query.user_inv);
                        url += '&response_type=code';
                        url += '&scope=snsapi_userinfo';

                        window.location.href = url;
                      }
                  })

                }else{
                  var url = 'https://open.weixin.qq.com/connect/oauth2/authorize?';
                  url += 'appid=wxddcfde267c9679f5';
                  url += '&redirect_uri=' + encodeURIComponent('https://wx.jianzhiwz.top/h5/index?user_inv='+this.$route.query.user_inv);
                  url += '&response_type=code';
                  url += '&scope=snsapi_userinfo';

                  window.location.href = url;
                }


              }
        			// vant.Toast(response.data.msg.info);
        		}
        	})
      },


    }
  }
</script>


<style scoped lang="less">


</style>
